@import "../../style/const.scss";

@media only screen and (min-width: 767px) {
    #root {
        // reset dumi style
        .dumi-default-header {
            background-color: rgba(255, 255, 255, 0.75);
            box-shadow:
                0 1px 2px 0 rgba(0, 0, 0, 0.03),
                0 1px 6px -1px rgba(0, 0, 0, 0.02),
                0 2px 4px 0 rgba(0, 0, 0, 0.02);
        }
        .dumi-default-header-content {
            height: 64px;
            max-width: 100vw;
        }
        .dumi-default-header-left {
            width: auto;
        }
        .dumi-default-header-right {
            justify-content: end;
            align-items: center;
            gap: 14px;
        }
        .dumi-default-logo {
            font-size: 18px;
            font-weight: 600;
            color: $basic-black-color;
            img {
                height: 40px;
            }
        }
        .dumi-default-navbar > li {
            font-size: $navbar-font-size;
            padding: 0 $navbar-font-size;
            &:not(:last-child) {
                margin-inline-end: 0;
            }
            a {
                color: $basic-black-color;
            }
            a.active {
                color: $primary-color;
            }
        }
    }
}

@media only screen and (max-width: 767px) {
    #root {
        .dtc-github-icon {
            width: 100%;
            padding: 12px 0;
            font-size: 18px;
            line-height: 1;
            text-align: center;
            display: block;
        }
    }
}
